<!DOCTYPE html>
<html>
<head>
  <title>一颗粮食的万里长征</title>
  <meta charset="utf-8"/>
  <style type="text/css">
    body {
      margin: 0 auto;
      /* width: 640px;
      height: 1030px; */
      width: 100vw;
      height: 100vh;
      position: relative;
      background-image:url("beijing.png");
      background-repeat:no-repeat;
      /* background-size:630px 1030px; */
      background-size: cover;
      background-position:center;
      /* text-align:center; */
      overflow: hidden;
      
    }
    .head {
      display: flex;
      flex-direction: column;
      position: absolute;
      height: inherit;
      width: inherit;
    }

    .sorghum_pile {
    width: 100%;
    max-height: 100%;
    position: absolute;
    top:0;
    left:0;
    }


    .shangbiao_container{
      margin:auto 0;
      width:100%;
    }
    .shangbiao{
      width: 100%;
    }

    .title1{
      position: absolute;
      bottom: 50px;
      left:20px;
      font-size:40px;
      font-family:宋体;
      text-shadow: 2px 2px;
      color:white;
      cursor:pointer;
      
    }
    .title1{
      bottom: 20vh;
    }
    .title1:hover{
        background-color:#5c2223;
      }
    .title:link {
      		color:red;
      		text-decoration:underline;
    		}
    
        .title:visited {
      		color:green;
      		text-decoration:none;
    		}
    
        .title:hover {
      		color:black;
      		text-decoration:none;
    		}
    
        .title:active {
      		color: white;
      		text-decoration:none;
    		}
      @media screen and (max-width: 640px) {
        /* .title1{
          font-size: 20px;
        } */
        
      }
  </style>
</head>
<body>
    <div class="head">
      <img class="sorghum_pile" src="高粱堆.png" alt="高粱堆">
      <div class="shangbiao_container">
        <img class="shangbiao" src="商标.png" alt="茅台酒商标">
      </div>
    </div> 

    <a href="http://yancy770.gitee.io/2jiemian" class="title1" >一颗粮食的万里长征<br>——茅台酒制作</a>
    

 
</body>
</html>